<template>
  <div>
    <header-m></header-m>
    <div class="bossIn-btm2" v-if="this.$store.state.isOnline">
      <ul v-if="love.length">
        <li v-for="(item,index) of love" :key="index">
          <div>
            <img :src="item.actorImg" />
            <h1>
              {{item.actorName}}
              <small>{{Math.floor(item.fans/10000)}} 万粉丝</small>
            </h1>
            <span @click="del(item.id)">取消关注</span>
          </div>
        </li>
      </ul>
      <div v-else>
        <img width="100%"  src="../assets/images/k.png" >
      </div>
    </div>
    <div class="stop" v-else @click="login">点此登录查看</div>
  </div>
</template>

<script>
import headerM from '../components/HeaderM'
export default {
  data() {
    return {
      love: [],
    };
  },
  components:{
    headerM,
  },
  methods: {
    mount(){
      this.axios.get("/follow?userid=" + this.$store.state.userId).then((res) => {
      this.love = res.data.result;
    });
    },
    back() {
      history.go(-1);
    },
    login() {
      location.href = "#/login";
    },
    del(val,) {
      this.axios.post("/dellove", "actor_id=" + val+'&user_id='+this.$store.state.userId).then((res) => {
        this.mount()
      });
    },
  },
  mounted() {
    this.mount()
  },
};
</script>
<style scoped>
.head2 {
  width: 100%;
  height: 60px;
  background-color: deeppink;
  font-size: 20px;
  line-height: 60px;
  color: white;
}
.head2 i {
  float: left;
  margin-top: 13px;
}
.el-icon-arrow-left {
  font-size: 30px;
  color: white;
}
.bossIn-btm2 {
  width: 100%;
  overflow: scroll;
  position: relative;
  margin-bottom: 15px;
}
.bossIn-btm2 ul li div {
  border-bottom: 1px solid #dddddd;
  display: flex;
  padding: 20px 0;
}
.bossIn-btm2 ul li div img {
  width: 25%;
  border-radius: 50%;
}
.bossIn-btm2 ul li div h1 {
  font-size: 19px;
  font-weight: normal;
  margin: 15px 0 0 15px;
}
.bossIn-btm2 ul li div h1 small {
  display: block;
  font-size: 12px;
  width: 90px;
  color: #999;
}
.bossIn-btm2 ul li div span {
  margin-top: 15px;
  margin-left: 25px;
  padding: 7px 10px 0 10px;
  border: solid 1px #ff1268;
  height: 35px;
  border-radius: 20px;
  color: #ff1268;
  font-size: 13px;
}
.stop {
  margin-top: 20px;
  color: dimgray;
  box-shadow: 1px 1px 1px 1px deepskyblue;
}
</style>
